<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
	<title>修改角色</title>
    #@head()
</head>
<body class="gray-bg">
	<div class="wrapper wrapper-content ">
		<div class="row">
			<div class="col-sm-12">
				<div class="ibox float-e-margins">
					<div class="ibox-content">
						<form class="form-horizontal m-t" id="form">

							<div class="form-group">
								<label class="col-sm-3 control-label">角色名：</label>
								<div class="col-sm-8">
									<input id="roleName" name="bean.roleName" class="form-control required" type="text" value="#(bean.roleName)">
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label">备注：</label>
								<div class="col-sm-8">
									<input id="remark" name="bean.remark" class="form-control" type="text" value="#(bean.remark)">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">拥有所有权限：</label>
								<div class="col-sm-8 i-checks">
									<label class="radio-inline">
										<input type="radio" name="bean.isSuper" class="required" value="0" #if(bean.isSuper == "0") checked #end > 否
									</label>

									<label class="radio-inline">
										<input type="radio" name="bean.isSuper" class="required" value="1" #if(bean.isSuper == "1") checked #end > 是
									</label>
								</div>
							</div>

							<div class="form-group" id="menuPerm">
								<label class="col-sm-3 control-label">菜单权限：</label>
								<div class="col-sm-8">
									<div id="menuTree"></div>
								</div>
							</div>

							<div class="form-group">
								<div class="col-sm-8 col-sm-offset-3">
									<input id="roleId" name="bean.id" type="hidden" value="#(bean.id)">
                                    <input id="menuIds" name="menuIds" type="hidden">
									<button type="submit" class="btn btn-primary">提交</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
#@footer()
<script type="text/javascript">
    $().ready(function() {
        getMenuTreeData();
        validateRule();

        //监听【拥有所有权限】是
        $(".i-checks input[value='1']").on("ifChanged",function(event){
            var checkVal = $(this).prop("checked");
            console.log(checkVal)
            if(checkVal){
                $('#menuPerm').hide();
            }else{
                $('#menuPerm').show();
            }
        })

    	#if(bean.isSuper == "1")
    	    $('#menuPerm').hide();
		#end
    });

    var prefix = ctx +"./"
    var menuIds = '';

    function save() {
        $('#menuIds').val(menuIds);

        $.ajax({
            cache : true,
            type : "POST",
            url : prefix +"update",
            data : $('#form').serialize(), // 你的formid
            async : false,
            error : function(request) {
                parent.layer.alert("网络超时");
            },
            success : function(data) {
                if (data.code == 0) {
                    parent.layer.msg("操作成功");
                    parent.reLoad();
                    var index = parent.layer.getFrameIndex(window.name);
                    parent.layer.close(index);

                } else {
                    parent.layer.alert(data.msg)
                }

            }
        });

    }
    function validateRule() {
        var icon = "<i class='fa fa-times-circle'></i> ";
        $("#form").validate({
            submitHandler : function() {
                getAllSelectNodes();
                save();
            }
        })
    }


    function loadMenuTree(menuTree) {
        $('#menuTree').jstree({
            "plugins" : [ "wholerow", "checkbox" ],
            'core' : {
                'data' : menuTree
            },
            "checkbox" : {
                //"keep_selected_style" : false,
                //"undetermined" : true
                //"three_state" : false,
                //"cascade" : ' up'
            }
        });
        $('#menuTree').jstree('open_all');
    }
    function getAllSelectNodes() {
        var ref = $('#menuTree').jstree(true); // 获得整个树
        menuIds = ref.get_selected(); // 获得所有选中节点的，返回值为数组
        $("#menuTree").find(".jstree-undetermined").each(function(i, element) {
            menuIds.push($(element).closest('.jstree-node').attr("id"));
        });
        console.log(menuIds);
    }
    function getMenuTreeData() {
        var roleId = $('#roleId').val();
        $.ajax({
            type : "GET",
            url : "../menu/tree?roleId=" + roleId,
            success : function(data) {
                loadMenuTree(data);
            }
        });
    }
</script>

</html>
